<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>购买 iPhone 13 Pro 和 iPhone 13 Pro Max - Apple (中国大陆)</title>
    <link rel="icon" href="imgs/apple.ico">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/goods-desc.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="fontawesome-pro-5.15.3-web/css/all.min.css">
    <link rel="stylesheet" href="libs/swiper-bundle.min.css">
</head>

<body>
    <nav class="top-nav">
        <div class="container">
            <ul class="nav-list font_14px">
                <li><a href="index.html"><i class="fab fa-apple"></i></a></li>
                <li><a href="store.html">商店</a></li>
                <li><a href="mac.html">Mac</a></li>
                <li><a href="iPad.html">iPad</a></li>
                <li><a href="iPhone.html">iPhone</a></li>
                <li><a href="Watch.html">Watch</a></li>
                <li><a href="Music.html">Music</a></li>
                <li><a href="Tec.html">技术支持</a></li>
                <li><a href="javascript:;" id="search-btn"><i class="fal fa-search"></i></a></li>
                <li><a href="javascript:;" id="bag-a-btn"><i class="fal fa-shopping-bag"></i>
                        <span class="bag-goods-num">2</span>
                    </a>
                    <aside class="bag-wrapper" style="display: none;">
                        <ul class="bag-goods-list">
                            <div class="angle"></div><!-- 不合理 但是设置了绝对定位 对布局不影响 -->
                            <li class="goods-item">
                                <a href="goods-desc.html">
                                    <img src="./imgs/store/iphone-13-pro-blue-select.png" alt="">
                                    <span class="font_14px">iPhone 13 Pro 128GB 远峰蓝色</span>
                                </a>
                            </li>
                            <li class="goods-item">
                                <a href="javascript:;">
                                    <img src="./imgs/store/imac-24-blue-selection-hero-202104.png" alt="">
                                    <span class="font_14px">24 英寸配备 4.5K 视网膜显示屏的 iMac - 蓝色</span>
                                </a>
                            </li>
                        </ul>
                        <a href="javascript:;" class="white check-btn bold">
                            结账
                        </a>
                        <nav class="bagview-nav">
                            <ul class="bag-view-nav-list">
                                <li><a href="bag.html" class="blue-more font_12px"><i
                                            class="fal fa-shopping-bag"></i>购物袋</a></li>
                                <li><a href="javascript:;" class="blue-more font_12px"><i
                                            class="fal fa-heart"></i>收藏</a></li>
                                <li><a href="javascript:;" class="blue-more font_12px"><i class="fal fa-cube"></i>订单</a>
                                </li>
                                <li><a href="javascript:;" class="blue-more font_12px"><i class="fal fa-cog"></i>账户</a>
                                </li>
                                <li><a href="login.html" class="blue-more font_12px"><i
                                            class="fas fa-user-circle"></i>注销 文龙</a></li>
                            </ul>
                        </nav>
                    </aside>
                </li>
                <li class="search-outter-wrapper" style="display: none;">
                    <div class="search-inner-wrapper">
                        <form action="get" class="search-form">
                            <button type="button"><i class="fal fa-search"></i></button>
                            <input type="text" placeholder="搜索 apple.com.cn" />
                            <button type="button" id="cancel-search" class="pointer"><i
                                    class="fal fa-times"></i></button>
                        </form>
                        <aside class="search-list-wrapper">
                            <h3 class="quick-links">快速链接</h3>
                            <a href="javascript:;" class="font_12px">查找零售店</a>
                            <a href="javascript:;" class="font_12px">Apple Store 商店在线选购</a>
                            <a href="javascript:;" class="font_12px">配件</a>
                            <a href="javascript:;" class="font_12px">Airpods</a>
                            <a href="javascript:;" class="font_12px">AirTag</a>
                        </aside>
                    </div>
                </li>
            </ul>
        </div>
    </nav>
    <section class="fixed-search">
        <div class="search-outter-wrapper">
            <div class="search-inner-wrapper">
                <form action="get" class="search-form">
                    <input type="text" placeholder="搜索 apple.com.cn" id="fixed-search-text" />
                    <button type="button" class="pointer"><i class="fal fa-search"></i></button>
                </form>
                <aside class="search-list-wrapper" style="display: none;">
                    <h3 class="quick-links">快速链接</h3>
                    <a href="javascript:;" class="font_12px">查找零售店</a>
                    <a href="javascript:;" class="font_12px">Apple Store 商店在线选购</a>
                    <a href="javascript:;" class="font_12px">配件</a>
                    <a href="javascript:;" class="font_12px">Airpods</a>
                    <a href="javascript:;" class="font_12px">AirTag</a>
                </aside>
            </div>
            </li>
    </section>
    <section class="mask-layer" style="display: none;"></section>
    <section class="goods-desc-title">
        <div class="container fixed-title">
            <p class="bold">
                iPhone 13 Pro
            </p>
            <p>
                RMB 333/月或 RMB 7999 起
            </p>
        </div>
    </section>
    <section class="nav-tips font_14px">
        <div class="container">
            <p class="black-more font_12px">

                在线加入 iPhone 年年焕新计划更轻松，只需于购买新款 iPhone 时加购 AppleCare+ 服务计划即可。
            </p>
            <p class="black-more font_12px">

                已加入年年焕新计划？<a href="javascript:;" class="blue-more">查询升级换购资格 </a>并预约到店升级换购。
            </p>
            <p class="black-more font_12px" style="padding-top: 32px;">
                符合条件的情况下可享免息分期付款。
                <a href="javascript:;" class="blue-more">进一步了解 &gt;</a>
            </p>

        </div>
    </section>
    <section class="container goods-desc-container ">
        <div class="goods-info-container">
            <p class="goods-sub-title font_14px t-left">新款</p>
            <p class="goods-title bold t-left">购买 iPhone 13 Pro</p>
            <p class="goods-tips t-left font_14px">每位顾客限购 2 部 iPhone 13 Pro。</p>
            <p class="goods-tadein-message t-left">用 iPhone 8 或更新机型折抵换购可享</br>
                RMB 600 ‑ RMB 5000 的折抵优惠*</p>
            <p class="goods-tadein-message t-left"><a href="javascript:;" class="blue-more t-left">了解 Apple Trade
                    In换购计划的流程</a></p>
            <p class="t-left bold" style="padding-top: 23px;">选择机型</p>
            <p class="t-left" style="padding-top: 14px;"><a href="javascript:;"
                    class="blue-more font_12px t-left">哪款机型适合你？</a></p>
            <div class="iphone-selector pointer">

                <div class="iphone-selector-l">
                    <p class="iphone-selector-l-title t-left bold">iPhone 13 Pro</p>
                    <p class="iphone-selector-l-subTitle t-left font_12px">6.1 英寸显示屏<sup>1</sup></p>
                </div>
                <div class="iphone-selector-r">
                    <p class="iphone-selector-l-title t-left">RMB 333/月或</br>RMB 7999 起</p>
                </div>
            </div>
            <div class="iphone-selector pointer">
                <div class="iphone-selector-l">
                    <p class="iphone-selector-l-title t-left bold">iPhone 13 Pro Max</p>
                    <p class="iphone-selector-l-subTitle t-left font_12px">6.7 英寸显示屏<sup>1</sup></p>
                </div>
                <div class="iphone-selector-r">
                    <p class="iphone-selector-l-title t-left">RMB 375/月或</br>RMB 8999 起</p>
                </div>
                </label>
            </div>
            <p class="color-title t-left bold">请选择外观</p>
            <div class="color-container">
                <label>
                    <input type="radio" name="color-selector" id="">
                    <div class="color-selector-info font_12px pointer">
                        <img src="imgs/goods-desc/iphone-finish-blue-2021.png" alt="">
                        远峰蓝色
                    </div>
                </label>
                <label>
                    <input type="radio" name="color-selector" id="">
                    <div class="color-selector-info font_12px pointer">
                        <img src="imgs/goods-desc/iphone-finish-silver-2021.png" alt="">
                        银色
                    </div>
                </label>
                <label>
                    <input type="radio" name="color-selector" id="">
                    <div class="color-selector-info font_12px pointer">
                        <img src="imgs/goods-desc/iphone-finish-gold-2021.png" alt="">
                        金色
                    </div>
                </label>
                <label>
                    <input type="radio" name="color-selector" id="">
                    <div class="color-selector-info font_12px pointer">
                        <img src="imgs/goods-desc/iphone-finish-graphite-2021.png" alt="">
                        石墨色
                    </div>
                </label>
            </div>
            <div class="storage-container">
                <p class="color-title t-left bold" style="border-bottom: none;">请选择存储容量</p>
                <p class="t-left">
                    <a href="javascript:;" class="blue-more font_12px t-left">多大的存储容量适合你？</a>
                </p>
                <div class="color-container">
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info font_12px pointer">
                            <p class="color-selector-info-title">128<small>GB<sup>2</sup></small></p>
                            RMB 375/月<sup>‡</sup> 或</br>RMB 8,999
                        </div>
                    </label>
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info font_12px pointer">
                            <p class="color-selector-info-title">256<small>GB<sup>2</sup></small></p>
                            RMB 408/月<sup>‡</sup> 或</br>RMB 9,799
                        </div>
                    </label>
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info font_12px pointer">
                            <p class="color-selector-info-title">512<small>GB<sup>2</sup></small></p>
                            RMB 475/月<sup>‡</sup> 或</br>RMB11,399
                        </div>
                    </label>
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info font_12px pointer">
                            <p class="color-selector-info-title">1<small>TB<sup>2</sup></small></p>
                            RMB 542/月<sup>‡</sup> 或</br>RMB 12,999
                        </div>
                    </label>
                </div>
            </div>
            <div class="discount">
                <p class="color-title t-left bold">您是否有智能手机要折抵？</p>
                <p class="t-left">
                    <a href="javascript:;" class="blue-more font_12px t-left">了解 Apple Trade In 换购计划的流程</a>
                </p>
                <div class="discount-selector-info">
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info pointer">
                            是
                        </div>
                    </label>
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info pointer">
                            否
                        </div>
                    </label>
                </div>
            </div>
            <div class="discount applecare">
                <p class="color-title t-left bold">是否要添加 AppleCare+ 服务计划？</p>
                <p class="t-left">
                <p class="font_12px t-left">获得长达 2 年的额外硬件保修和软件支持服务，并优先获得由精通 iPhone 的专家提供的支持。</p>
                </p>
                <div class="discount-selector-info">
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info pointer">
                            无 AppleCare+ 服务计划
                        </div>
                    </label>
                    <label>
                        <input type="radio" name="color-selector" id="">
                        <div class="color-selector-info pointer" style="height:261px">
                            <div class="applecare-l">
                                AppleCare+ 服务计划 (同时加入 iPhone 年年焕新计划)
                            </div>
                            <div class="applecare-r">
                                RMB 62/月 (24 期) 或 RMB 1,498
                            </div>
                            <ul class="applecare-list">
                                <li class="font_12px t-left">
                                    优先获得 Apple 专家的帶助
                                </li>
                                <li class="font_12px t-left">
                                    经 Apple 认证、使用 Apple 原装配件的推技服务
                                </li>
                                <li class="font_12px t-left">
                                    服务范国涵盖 iPhone 及电池
                                </li>
                                <li class="font_12px t-left">
                                    意外损怀保储服务
                                </li>
                            </ul>
                            <p class="font_12px t-left">
                                购买此 Apple Care + 服务计划即自动加入 iPhone 年年焕新计划。加入该焕新
                                计划后，你将能以购买此 iPhone 所支付云告价格的50% 作为折抵优惠，来升级换购下一部新款 iPhone.
                            </p>
                        </div>
                        <p class="goods-tadein-message t-left font_12px"><a href="javascript:;"
                                class="blue-more t-left">进一步了解 AppleCare+ 服务计划(同时加入 iPhone 年年焕新计划) &gt;</a></p>
                    </label>
                </div>
            </div>
            <div class="purchase-info">
                <div class="purchase-price">
                    <p class="t-left bold" style="font-size:32px">RMB 475/月 (24 期)</p>
                    <p class="t-left" style="font-size: 17px; padding: 8px 0;">或</p>
                    <p class="t-left bold" style="font-size:32px">RMB 11,399</p>
                    <p class="t-left font_12px" style="color: #868686;line-height: 16px;">含增值税及其他法定税费：约 RMB
                        1,318<sup>‡</sup>。</p>
                    <p class="t-left"><a href="javascript:;" class="font_12px blue-more ">可享免息分期付款</a>
                    </p>
                </div>
                <div class="purchase-price">
                    <p class="t-left font_12px  bold">
                        <img src="imgs/goods-desc/icon-pic1.png" alt="">
                        预计发货日期
                    </p>
                    <p class="t-left font_12px  bold" style="padding-left: 40px;">
                        5-6 周
                    </p>
                    <p class="t-left font_12px  bold" style="padding-left: 40px;">
                        免费送货
                    </p>
                    <p class="t-left" style="padding-left: 40px;"><a href="javascript:;"
                            class="font_12px blue-more ">查看送货日期</a>
                    <p class="t-left font_12px  bold">
                        <img src="imgs/goods-desc/icon-pic3.png" alt="">
                        取货:
                    </p>

                    <p class="t-left" style="padding-left: 43px;line-height: 40px;"><a href="javascript:;"
                            class="font_12px blue-more ">查看供货情况</a>
                    </p>
                    <p class="buy-btn">
                        <button type="button" class="white pointer">添加到购物袋</button>
                        <a href="javascript:;" class="blue-more"><i class="fal fa-heart"></i></a>
                    </p>
                </div>
            </div>
        </div>
        <div class="window-container">
            <div class="magnifier"></div>
            <div class="magnifier-screen">
                <img src="imgs/goods-desc/iphone-13-pro-blue-select.png" alt="" width="940">
            </div>
            <div class="swiper-container gallery-top">
                <div class="swiper-wrapper">
                    <div class="swiper-slide goods-img-l">
                        <img src="imgs/goods-desc/iphone-13-pro-blue-select.png" alt="">
                    </div>
                    <div class=" swiper-slide goods-img-l">
                        <img src="imgs/goods-desc/iphone-13-pro-graphite-select.png" alt="">
                    </div>
                    <div class="swiper-slide goods-img-l">
                        <img src="imgs/goods-desc/iphone-13-pro-gold-select.png" alt="">
                    </div>
                    <div class="swiper-slide goods-img-l">
                        <img src="imgs/goods-desc/iphone-13-pro-silver-select.png" alt="">
                    </div>
                </div>
                <div class="swiper-button-next swiper-button-black"></div>
                <div class="swiper-button-prev swiper-button-black"></div>
            </div>

            <div class="swiper-container gallery-thumbs">
                <div class="swiper-wrapper">
                    <div class="swiper-slide goods-img-sub pointer">
                        <img src="imgs/goods-desc/iphone-13-pro-blue-select.png" alt="">
                    </div>
                    <div class="swiper-slide goods-img-sub pointer">
                        <img src="imgs/goods-desc/iphone-13-pro-graphite-select.png" alt="">
                    </div>
                    <div class="swiper-slide goods-img-sub pointer">
                        <img src="imgs/goods-desc/iphone-13-pro-gold-select.png" alt="">
                    </div>
                    <div class="swiper-slide goods-img-sub pointer">
                        <img src="imgs/goods-desc/iphone-13-pro-silver-select.png" alt="">
                    </div>
                </div>
            </div>

            <div class="buy-strip">
                <div>
                    <p class="icon"><img src="imgs/goods-desc/icon-pic1.png" alt=""></p>
                    <p class="buy-strip-title font_12px">免费送货</p>
                </div>
                <div>
                    <p class="icon"><img src="imgs/goods-desc/icon-pic2.png" alt=""></p>
                    <p class="buy-strip-title  font_12px">简单免费的退货服务</p>
                </div>
            </div>
            <div class="question">
                <img src="imgs/goods-desc/incon-pic4.png" alt="">
                <span class="font_12px">对于购买 iPhone 有任何疑问?</br></span>
                <a href="javascript:;" class="blue-more font_12px">与 iPhone Specialist 专家在线交流</a>
            </div>
        </div>
        <div class="goods-img-banner pointer">
            <img src="imgs/goods-desc/middle-banner.png" alt="">
            <img src="imgs/goods-desc/big-banner.png" alt="">
            
        </div>
    </section>
    <footer>
        <div class="footnotes-content">
            <div class="foot-path">
                <span><a href="javascript:;"><i class="fab fa-apple"></i></a></span>
                <span class="font_12px">&gt;</span>
                <span class="font_12px">Apple Store</span>
            </div>
        </div>
        <div class="footer-nav container">
            <ul class="footer-nav-list">
                <li class="font_12px bold">选购及了解</li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Mac</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">iPad</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">iPhone</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Apple Watch</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Music</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">iTunes</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">HomePod</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">iPod touch</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">配件</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">充值卡</a></li>
            </ul>
            <ul class="footer-nav-list">
                <li class="font_12px bold">Apple Store 商店</li>
                <li class="font_12px"><a href="javascript:;" class="black-more">查找零售店</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">在线选购</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Genius Bar 天才吧</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Today at Apple</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">青少年活动</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Apple Store App</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">翻新和优惠</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">分期付款</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Apple Trade In 换购计划</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">订单状态</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">选购帮助</a></li>
            </ul>
            <ul class="footer-nav-list">
                <li class="font_12px">
                    <span class="bold">教育应用</span>
                    <ul>
                        <li class="font_12px"><a href="javascript:;" class="black-more">Apple 与教育</a></li>
                        <li class="font_12px"><a href="javascript:;" class="black-more">高校师生选购</a></li>
                    </ul>
                </li>
                <li class="font_12px">
                    <span class="bold" style="margin-top: 15px;">商务应用</span>
                    <ul>
                        <li class="font_12px"><a href="javascript:;" class="black-more">Apple 与商务</a></li>
                        <li class="font_12px"><a href="javascript:;" class="black-more">商务选购</a></li>
                    </ul>
                </li>
            </ul>
            <ul class="footer-nav-list">
                <li class="font_12px">
                    <span class="bold">账户</span>
                    <ul>
                        <li class="font_12px"><a href="javascript:;" class="black-more">管理你的 Apple ID</a></li>
                        <li class="font_12px"><a href="javascript:;" class="black-more">Apple Store 账户</a></li>
                    </ul>
                </li>
                <li class="font_12px">
                    <span class="bold" style="margin-top: 15px;">Apple价值观</span>
                    <ul>
                        <li class="font_12px"><a href="javascript:;" class="black-more">辅助功能</a></li>
                        <li class="font_12px"><a href="javascript:;" class="black-more">环境责任</a></li>
                        <li class="font_12px"><a href="javascript:;" class="black-more">隐私</a></li>
                        <li class="font_12px"><a href="javascript:;" class="black-more">供应商责任</a></li>
                    </ul>
                </li>
            </ul>
            <ul class="footer-nav-list">
                <li class="font_12px bold">关于 Apple</li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Apple 咨询</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">工作机会</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">Newsroom</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">商业道德与合规性</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">活动</a></li>
                <li class="font_12px"><a href="javascript:;" class="black-more">联系 Apple</a></li>
            </ul>
        </div>
        <div class="footer-more-info font_12px container">
            更多选购方式: <a href="javascript:;" class="black-more">查找你附近的 Apple Store 零售店</a>及
            <a href="javascript:;" class="black-more">更多门店</a>,或者致电 400-666-8800 。
        </div>
        <div class="footer-policy container font_12px">
            Copyright &copy; Apple lnc. 保留所有权利。
            <a href="javascirpt:;" class="font_12px black-more">隐私政策</a>
            <a href="javascirpt:;" class="font_12px black-more">使用条款</a>
            <a href="javascirpt:;" class="font_12px black-more">销售政策</a>
            <a href="javascirpt:;" class="font_12px black-more">法律信息</a>
            <a href="javascirpt:;" class="font_12px black-more">网站地图</a>
        </div>
    </footer>
    <script src="js/jquery.min.js"></script>
    <script src="libs/swiper-bundle.js"></script>
    <script src="js/common/common.js"></script>
    <script src="js/goods-desc/goods-desc.js"></script>
</body>

</html>